@import 'src/styles/mixin';

$text-large: 18px;
$text-big: 16px;
$text-medium: 14px;
$text-small: 12px;
$text-tiny: 10px;

$text-large-lh: 20px;
$text-big-lh: 18px;
$text-medium-lh: 16px;
$text-small-lh: 15px;
$text-tiny-lh: 12px;

$text-big-max-height3: 54px;
$text-medium-max-height3: 48px;
$text-samll-max-height3: 42px;
$text-big-max-height2: 36px;
$text-medium-max-height2: 32px;
$text-medium-max-height: 16px;
$text-small-max-height2: 30px;
$text-small-max-height: 15px;
$text-tiny-max-height: 12px;

.title-big {
  //line-height: $text-big-lh;
  font-size: $text-big;
  max-height: $text-big-max-height2;
  color: #333;
  font-weight: bold;
}
.sub-title-big {
  line-height: $text-big-lh;
  font-size: $text-big;
  color: #666;
}
.third-title-big {
  line-height: $text-big-lh;
  font-size: $text-big;
  color: #999;
}

.title-large {
  line-height: $text-large-lh;
  font-size: $text-large;
  color: #666;
  font-weight: bold;
}
.sub-title-large {
  line-height: $text-large-lh;
  font-size: $text-large;
  color: #666;
}
.third-title-large {
  line-height: $text-large-lh;
  font-size: $text-large;
  color: #999;
}

.title-md {
  line-height: $text-medium-lh;
  height: $text-medium-max-height;
  font-size: $text-medium;
  color: #666;
  font-weight: bold;
}
.sub-title-md {
  line-height: $text-medium-lh;
  height: $text-medium-max-height;
  font-size: $text-medium;
  color: #666;
}
.third-title-md {
  //line-height: $text-medium-lh;
  font-size: $text-medium;
  color: #999;
}

.title-sm {
  line-height: $text-small-lh;
  font-size: $text-small;
  color: #666;
  font-weight: bold;
}
.sub-title-sm {
  line-height: $text-small-lh;
  font-size: $text-small;
  color: #666;
}
.third-title-sm {
  //line-height: $text-small-lh;
  font-size: $text-small;
  color: #999;
}

.title-tiny {
  //line-height: $text-tiny-lh;
  font-size: $text-tiny;
  color: #666;
  font-weight: bold;
}
.sub-title-tiny {
  line-height: $text-tiny-lh;
  font-size: $text-tiny;
  color: #666;
}
.third-title-tiny {
  line-height: $text-tiny-lh;
  font-size: $text-tiny;
  color: #999;
}

.confirm-btn {
  background-color: #617fde;
  border-radius: 10px;
  height: 45px;
  @include center;
  margin-top: 20px;
  width: 275px;
  font-size: 15px;
  color: #e7ecfa;
  @include letter1;
}


$bg-color: #EFF4F9;
$primary-color: #5B7FFF;
$primary-color_shadow: #F0F4FF;
$error-color: #FF7B00;
$error-color_shadow: #FEEBEB;

.bg {
  background-color: $bg-color;
}
.primary-color {
  color: $primary-color;
}
.primary-bg {
  background-color: $primary-color_shadow;
}
.error-color {
  color: $error-color;
}
.error-bg {
  background-color: red;
}
